/*
全局样式变量定义
*/

// 全局字体定义
@font-family : 'PingFang SC,-apple-system,BlinkMacSystemFont,Helvetica Neue For Number,Segoe UI,Roboto,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif';


// =======全局颜色 start=========
// 背景颜色
@color-back-white:#fff;
@color-back-orange:#FF6416;
@color-back-red:#F31616;
@color-back-gray:#f0f0f0;
@color-back-gray2:#f5f5f5;
@color-back-gray3:#f3f3f3;
@color-back-blue:#1669F3;
@color-back-blue-light:#1DC3FF;

// 字体颜色
@color-font-blue:#1779F5;
@color-font-red:#F52116;
@color-font-yellow:gold;
@color-font-black:#333;
@color-font-gray:#666;
@color-font-gray2:#999;
@color-font-light-gray:#c1c1c1;

// =======全局颜色 end==========


// 全局字体大小，由大到小
@font-size0 : 1rem;
@font-size1 : 1.1rem;
@font-size2 : 1.2rem;
@font-size3 : 1.3rem;
@font-size4 : 1.4rem;
@font-size5 : 1.5rem;
@font-size6 : 1.6rem;
@font-size7 : 1.7rem;
@font-size8 : 1.8rem;

// 全局圆角的定义
@border-radius-base : 5px;
@border-radius2 : 12px;


// 边框颜色
@border-color-base : rgba(218,218,218,0.5); // 常见灰色边框颜色的定义
@border-color-split : #dfe4ea; // 常见淡蓝色边框颜色的定义
@border-color-dark : #777C8D; // 常见淡蓝色边框颜色的定义
@border-lightBlack : 1px solid #565c6d; // 常见弹框里的边框颜色
@border-base : 1px solid @border-color-base; // 常见灰色边框线的简写方式
@border-split : 1px solid @border-color-split; // 常见淡蓝色边框线的简写方式
@border-dark : 1px solid @border-color-dark; // 常见淡蓝色边框线的简写方式


// 全局所有的padding或者margin的常用间隔
@space-sm : 0.4rem;
@space-base : 0.8rem;
@space-middle : 1.2rem;
@space-normal : 1.4rem;
@space-big : 1.6rem;
@space-lg : 2.5rem;
@space-hg : 3.2rem;


// 头部导航栏高度
@navbar-height: 4.4rem;
@navbar-back-color:@color-back-red;

// 底部栏高度
@footer-height:5rem;


// 公共样式
.flex-col-center{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.flex-row-base{
  display: flex;
  flex-direction: row;
  align-items: center;
}

.flex-row-center{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.flex-row-between{
    .flex-row-base;
    justify-content: space-between;
}
